
<script>
import dataApi from '@/view/v/data-api'
import ControlItem from './Controls/IndexView'
// import exportImgData from './export-img-data'
import DocsAttachment from './DocsAttachment.vue'
export default {
  render () {
    let { dataCore, dpi, background } = this
    let sViewBox = {
      'background-image': `url(${background.image})`,
      'background-color': background.color,
      width: dpi.width + 'px',
      height: dpi.height + 'px',

      position: 'relative',
      // position: 'absolute',
      // left: 0,
      margin: '0 auto',
      overflow: 'hidden',
      'background-repeat': 'no-repeat',
      'background-size': '100% 100%'
    }

    let vControls = []
    if (this.hasDocsAttachment) {
      vControls = <DocsAttachment />
    } else {
      dataCore.controls.forEach((d, i) => {
        vControls.push(<ControlItem key={i} d={d} index={i} />)
      })
    }

    return (
      <div>
        <div style={sViewBox}>
          {vControls}
        </div>
      </div>
    )
  },
  computed: {
    dataCore () {
      return dataApi.core
    },
    dpi () {
      return dataApi.core.dpi
    },
    background () {
      return dataApi.core.background
    },
    hasDocsAttachment () {
      return dataApi.core.docsAttachment.list.length > 0
    }
  }
  // methods: {
  //   async getImg () {
  //     let blob = await exportImgData(this.$el.children[0])
  //     window.open(URL.createObjectURL(blob)) // 测试
  //     return new Promise((resolve) => {
  //       resolve('')
  //     })
  //   }
  // }
}
</script>
